<template>
	<view class="contactService">
		<u-navbar title="联系客服" :autoBack="true" :placeholder="true">
		</u-navbar>

		<button open-type="contact" class="wxContent" type="default">
			<view class="">
				咨询客服
			</view>
			<image src="https://mp.blrwworkshop.com/imgs/wxIcon.png" mode=""></image>
		</button>

	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			// 在需要触发客服聊天的地方调用此方法
			openWechatService() {
				// 检查是否在微信小程序环境
				if (uni.getSystemInfoSync().platform === 'devtools' || uni.getSystemInfoSync().platform === 'ios' || uni
					.getSystemInfoSync().platform === 'android') {
					// 调用微信客服接口
					wx.openCustomerServiceChat({
						// 可选：客服的公众号原始ID，如果没有可以不填
						corpId: '',
						// 可选：会话来源，用于统计
						sessionFrom: 'uniapp_miniprogram',
						success(res) {
							console.log('进入客服聊天成功', res)
						},
						fail(err) {
							console.error('进入客服聊天失败', err)
							uni.showToast({
								title: '进入客服失败，请稍后再试',
								icon: 'none'
							})
						}
					})
				} else {
					uni.showToast({
						title: '当前环境不支持客服功能',
						icon: 'none'
					})
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.contactService {
		width: 100%;
		min-height: 100vh;
		background-color: #F9F9F9;

		.wxContent {
			width: 690rpx;
			height: 140rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(255, 192, 143, 0.19);
			border-radius: 40rpx;
			font-weight: 400;
			font-size: 32rpx;
			color: #333333;
			margin: 16rpx auto;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 40rpx;
			box-sizing: border-box;
			border: none;
			outline: none;
			background-color: transparent;

			image {
				width: 152rpx;
				height: 88rpx;
			}
		}

		.wxContent::after {
			border: none;
		}

	}
</style>